import React, {useState, useEffect}from 'react'

import MyCard from '../../../components/MyCard'

import {Button, Spin} from 'antd'

import {Container} from './style'

import FriendlylinkRequest from '../../../request/friendlylink_request'

const friendlylink_request = new FriendlylinkRequest()


function Link(){
    const [linkList, setLinkList] = useState([])
    
    useEffect(() => {
        getFriendlyLinkList()
        document.getElementById('article-top-c').scrollTop = 0
    }, [])

    const getFriendlyLinkList = () => {
        friendlylink_request.getFriendlyLinkList({
            islogin: '0'
        }).then(res => {
            setLinkList(res)
        })
    }
    return (
        <Container>
            <MyCard notTitle={true}>
                <Spin spinning={linkList.length === 0}>
                    <div className="content">
                        {
                            linkList.map((item, index) => {
                                return (
                                    <div className="link-item" key={index}>
                                        <Button type="link" size="large" onClick={() => window.open(item.path)}><span className="content-link">{item.name}</span></Button>
                                        <div className="link-desc">{item.desc}</div>
                                    </div>
                                )
                            })
                        }
                    </div>
                </Spin>
            </MyCard>
        </Container>
    )
}

export default Link